<template>
    <div class="app-container vipcenter-main">
        <van-nav-bar title="续费"  left-arrow @click-left="handleBack" />
        <van-notice-bar 
            color="#7d7d7d"
            background="transparent"
            left-icon="volume-o"
            :text="noticeText"
        />
        <div class="vipcenter-container">
            <!-- <vip-card :userInfo="userInfo"></vip-card> -->
            
            <!-- 策略列表 -->
            <!-- <strategy-component @on-change="handleSelectStrategy"></strategy-component> -->

            <!-- 会员权益 -->
            <div class="system">
                <div class="system-title">会员权益</div>
                <privilege-component></privilege-component>
            </div>
            <van-tabs v-model:active="active">
                <van-tab v-for="(item, index) in tabList" :key="index" :title="item.label" >
                    <price-component :subscribeType="active"></price-component>
                </van-tab>
            </van-tabs>
            <div class="kefu-tip">会员充值问题可随时<span class="maincolor" @click="$router.push('/setting/kefu')">联系客服</span></div>
            
        </div>
    </div>
</template>

<script>
import PrivilegeComponent from '@/components/privilege/index';
import PriceComponent from '@/components/price/index';
export default {
    name: 'vip-center',
    components: {
        PrivilegeComponent,
        PriceComponent,
    },
    data() {
        return {
            userInfo: {},
            active: 0,
            tabList: [{
                label: '一卡通', 
                value: 1,
            }, {
                label: '单独订阅',
                value: 0,
            }],
            noticeText: '若微信二维码付款不可用，请直接联系人工客服微信： Grt0104,备用客服微信：Mz0508t',
            selectStrategy: {
                type: 0,
                strategy: ['ema'],
            },
        }
    },
    created() {
        this.init();
    },
    methods: {
        // 选择的策略
        handleSelectStrategy(item) {
            console.log('=======handleSelectStrategy', item);
            this.selectStrategy = item;
        },
        handleBack() {
            this.$router.push('/me')
        },
        init() {
            // getMyInfo().then(res => {
            //     if (res.code !== 20000) return;
            //     this.userInfo = res.data;
            // })
        },
    }
};
</script>
<style lang="less" scoped>
// .vipcenter-main {
//     background-color: #f3f3f3;
// }
.vipcenter-container {
    padding: 0 16px 16px;
}
</style>
